<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>用户</title>
  <!-- 浏览器 拿到 link 标签以后 会再次向服务器 发起请求 -->
  <link rel="stylesheet" href="./index.css" />
  <link rel="stylesheet" href="./font/iconfont.css" />
</head>

<body>
  <header>
    <div class="left">
      <div>
        <div style="font-weight: bold">管理系统</div>
        <div>首页</div>
        <div>
          系统管理
          <ul>
            <li>用户管理</li>
            <li>角色管理</li>
            <li>菜单管理</li>
            <li>部门管理</li>
            <li style="color: blue">岗位管理</li>
            <li>字典管理</li>
            <li>参数设置</li>
            <li>通知公告</li>
            <li>日志管理</li>
          </ul>
        </div>
        <div>系统监控</div>
      </div>
    </div>
    <div id="box">
      <div>
        <div><span class="iconfont icon-tianjia"></span></div>
        <div><span class="username">用户名</span><img src="./img/bg.jpg" alt=""></div>
      </div>
      <div class="btn"><button>首页</button><button>岗位管理</button></div>
      <div class="searchbox">岗位名称
        <input type="text" placeholder="请输入岗位名称" /><span class="search">搜索</span>
      </div>
      <div class="addbox">
        <span class="add"><span class="iconfont icon-tianjia"></span>添加用户</span>
      </div>

      <div class="table">
        <ul class="table-head">
          <li>岗位编号</li>
          <li>岗位编码</li>
          <li>岗位名称</li>
          <li>岗位排序</li>
          <li>状态</li>
          <li>创建时间</li>
          <li>操作</li>
        </ul>

        <div class="table-body">
          <ul class="row">
            <li>1</li>
            <li>ceo</li>
            <li>董事长</li>
            <li>1</li>
            <li>正常</li>
            <li>2022-10-19 20:56:47</li>
            <li>
              <span class="iconfont icon-bianji editicon" id="101"></span>
              <span class="iconfont icon-shanchu deleteicon" id="101"></span>
            </li>
          </ul>
          <ul class="row">
            <li>1</li>
            <li>ceo</li>
            <li>董事长</li>
            <li>1</li>
            <li>正常</li>
            <li>2022-10-19 20:56:47</li>
            <li>
              <span class="iconfont icon-bianji editicon" id="101"></span>
              <span class="iconfont icon-shanchu deleteicon" id="101"></span>
            </li>
          </ul>
          <ul class="row">
            <li>1</li>
            <li>ceo</li>
            <li>董事长</li>
            <li>1</li>
            <li>正常</li>
            <li>2022-10-19 20:56:47</li>
            <li>
              <span class="iconfont icon-bianji editicon" id="101"></span>
              <span class="iconfont icon-shanchu deleteicon" id="101"></span>
            </li>
          </ul>
          <ul class="row">
            <li>1</li>
            <li>ceo</li>
            <li>董事长</li>
            <li>1</li>
            <li>正常</li>
            <li>2022-10-19 20:56:47</li>
            <li>
              <span class="iconfont icon-bianji editicon" id="101"></span>
              <span class="iconfont icon-shanchu deleteicon" id="101"></span>
            </li>
          </ul>
        </div>
      </div>
      <div class="ope">
        <span class="prev">上一页</span>
        <span class="next">下一页</span>
      </div>
    </div>
    </main>
    <div class="mask">
      <div class="content">
        <div class="line">
          <label>岗位名称</label> <input type="text" placeholder="请输入岗位名称" />
        </div>
        <div class="line">
          <label>岗位编码</label> <input type="text" placeholder="请输入岗位编码" />
        </div>
        <div class="line">
          <input class="add" type="button" value="添加用户" />
        </div>
      </div>
    </div>



</body>

</html>
<script src="./axios.min.js"></script>

<script src="./index.js"></script>